<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="description" content="Miminium Admin Template v.1">
<meta name="author" content="Isna Nur Azis">
<meta name="keyword" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>油乐宝分销系统</title>

<!-- start: Css -->
<link rel="stylesheet" type="text/css" href="__PUBLIC__/asset/css/bootstrap.min.css">

<!-- plugins -->
<link rel="stylesheet" type="text/css" href="__PUBLIC__/asset/css/plugins/font-awesome.min.css"/>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/asset/css/plugins/simple-line-icons.css"/>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/asset/css/plugins/mediaelementplayer.css"/>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/asset/css/plugins/animate.min.css"/>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/asset/css/plugins/icheck/skins/flat/red.css"/>
<link href="__PUBLIC__/asset/css/style.css" rel="stylesheet">
<!-- end: Css -->

<link rel="shortcut icon" href="__PUBLIC__/asset/img/logomi.png">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>


<body id="mimin" class="dashboard">
      <!-- start: Header -->
      {include file="public/head" /}
      <!-- end: Header -->

      <div class="container-fluid mimin-wrapper">
  
          <!-- start:Left Menu -->
          {include file="public/left" /}
          <!-- end: Left Menu -->


          <!-- start: Content -->
          <div id="content">
             <div class="panel box-shadow-none content-header">
                  <div class="panel-body">
                    <div class="col-md-12">
                        <h3 class="animated fadeInLeft">报单 服务</h3>
                        <p class="animated fadeInDown">
                          首页 <span class="fa-angle-right fa"></span>报单 网络图
                        </p>
                    </div>
                  </div>
              </div>

            <div id="maindetail" style="width:900px;height:1000px;"></div>
          </div>
          </div>
          <!-- end: content -->
          
      </div>

      <!-- start: Mobile -->
      {include file="public/mobile" /}
       <!-- end: Mobile -->

<!-- start: Javascript -->
<script src="__PUBLIC__/asset/js/jquery.min.js"></script>
<script src="__PUBLIC__/asset/js/jquery.ui.min.js"></script>
<script src="__PUBLIC__/asset/js/bootstrap.min.js"></script>


<!-- plugins -->
<script src="__PUBLIC__/asset/js/plugins/moment.min.js"></script>
<script src="__PUBLIC__/asset/js/plugins/icheck.min.js"></script>
<script src="__PUBLIC__/asset/js/plugins/jquery.nicescroll.js"></script>


<!-- custom -->
<script src="__PUBLIC__/asset/js/main.js"></script>
<script type="text/javascript">
$(document).ready(function(){
     $('input').iCheck({
        checkboxClass: 'icheckbox_flat-red',
        radioClass: 'iradio_flat-red'
      });
});
</script>
<script src="__PUBLIC__/asset/js/echarts.min.js"></script>
<script>
    $(function () {
        var myChart = echarts.init(document.getElementById('maindetail'));

        myChart.showLoading();
        var data = {};

        $.ajax({
            url: "/index/business/picdata",
            type: 'POST',
            dataType: 'json',
            success:function(res){
                myChart.hideLoading();
                if(res.code==1) return false;
                data = res.data;
                tree(data,myChart);
            }
        })
    })
    function tree(data,myChart){
        echarts.util.each(data.children, function (datum, index) {
            index % 2 === 0 && (datum.collapsed = true);
        });
        

        myChart.setOption(option = {
            tooltip: {
                trigger: 'item',
                triggerOn: 'mousemove'
            },
            series: [
                {
                    type: 'tree',

                    data: [data],

                    top: '1%',
                    left: '7%',
                    bottom: '1%',
                    right: '20%',
                    initialTreeDepth:-1,
                    symbolSize: 20,

                    symbol: 'emptyCircle',

                    orient: 'vertical',

                    expandAndCollapse: true,

                    label: {
                        normal: {
                            position: 'top',
                            rotate: -90,
                            verticalAlign: 'middle',
                            align: 'right',
                            fontSize: 9
                        }
                    },

                    leaves: {
                        label: {
                            normal: {
                                position: 'bottom',
                                rotate: -90,
                                verticalAlign: 'middle',
                                align: 'left'
                            }
                        }
                    },

                    animationDurationUpdate: 750
                }
            ]
        });
    }
</script>
<!-- end: Javascript -->
</body>
</html>